<template>
	<view class="translate">
		<view class="swiper-frame">
			<uv-swiper :list="list" height="200px" circular></uv-swiper>
		</view>
		
		<view class="card-frame-2">
			<view class="card-item card-bg-1" @click="toNext('/pages/list/feature/feature')">
				脸型数据
			</view>
			<view class="card-item card-bg-2">
				体型数据
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		components: {
		},
		data() {
			return {
				list: [
					'https://tu.ltyuanfang.cn/api/fengjing.php?1',
					'https://tu.ltyuanfang.cn/api/fengjing.php?2',
					'https://tu.ltyuanfang.cn/api/fengjing.php?3',
				]
			}
		},
		onShow() {
		},
		methods: {
			toNext(url) {
				uni.navigateTo({
					url
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.swiper-frame {
		margin: 30rpx;
	}
	
	.card-frame-2 {
		display: flex;
		margin: 30rpx;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 30rpx;
		.card-item {
			height: 60px;
			border-radius: 6px;
			box-shadow: 0 0 3px -1px gray;
			color: #fff;
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.card-bg-1 {
			background: linear-gradient(to left top, #6f9aec, #15b5df, #22c7cd);
		}
		.card-bg-2 {
			background: linear-gradient(to right top, #6f9aec, #15b5df, #22c7cd);
		}
	}
</style>

